<script setup>
  import {ref} from "vue";

  const value1=ref(true);
  const value2=ref(true);
  const pic=ref(true);
  const numStr=ref('0');
  const num=ref(0);
</script>

<template>
  <h1>开关组件</h1>
  <el-switch v-model="value1" />
  <el-switch
      v-model="value2"
      class="ml-2"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
  />
  <hr>
  <el-switch v-model="pic"></el-switch>
  <br>
  <img src="img.png" width="200" v-if="pic">
  <hr>
  <el-switch v-model="numStr" :active-value="'1'" :inactive-value="'0'"></el-switch>
  <el-switch v-model="numStr" active-value="1" :inactive-value="0"></el-switch>
  <el-switch v-model="num" active-value="1" :inactive-value="0"></el-switch>
</template>

<style scoped>

</style>